﻿<%--
  Created by IntelliJ IDEA.
  User: hongcy
  Date: 16-3-20
  Time: 下午9:08
  To change this template use File | Settings | File Templates.
--%>
<%@ page contentType="text/html;charset=UTF-8" language="java" isELIgnored="false" %>
<%@ include file="/include/taglib.jsp" %>
<link rel="stylesheet" href="/static/kindeditor-4.1.7/themes/default/default.css" />
<link rel="stylesheet" href="/static/kindeditor-4.1.7/plugins/code/prettify.css" />
<script charset="utf-8" src="/static/kindeditor-4.1.7/kindeditor.js"></script>
<script charset="utf-8" src="/static/kindeditor-4.1.7/lang/zh_CN.js"></script>
<script charset="utf-8" src="/static/kindeditor-4.1.7/plugins/code/prettify.js"></script>

<div style="padding:20px 0px;">
    <form method="post" action="${ctx}/mulanweb/admin/ticket/save" id="ff">
        <table cellspacing="5" style="margin: 0 auto">
            <tr>
                <td>服务者编号:</td>
                <td><input type="text" name="sellerId" class="easyui-numberbox"
                           data-options="required:true,validType:{length:[1,15]}" style="width: 260px;"/></td>
            </tr>
            <tr>
                <td>类型:</td>
                <td><select id="add-type" class="easyui-combobox" style="width: 260px;">
                    <option value="1">门票</option>
                    <option value="2">购物优惠券</option>
                    <option value="3">餐饮优惠券</option>
                </select>
                </td>
            </tr>
            <tr>
                <td id="city-name">景点:</td>
                <td><select id="form-city" style="width: 260px;">
                </select>
                    <input type="hidden" id="cityId" name="cityId"/>
                    <input type="hidden" id="scenicSpotId" name="scenicSpotId"/>
                    <input type="hidden" id="typeId" name="typeId" value="1"/>
                </td>
            </tr>
            <tr>
                <td>标题(中):</td>
                <td><input type="text" name="title" class="easyui-textbox"
                           data-options="required:true,valiType:{length:[1,30]}" style="width:260px"></td>
            </tr>
            <tr>
                <td>标题(英):</td>
                <td><input type="text" name="titleEn" class="easyui-textbox"
                           data-options="required:true,valiType:{length:[1,30]}" style="width:260px"></td>
            </tr>
            <tr>
                <td>产品特点:</td>
                <td><textarea type="text" name="cpTd" class="easyui-textbox"
                           data-options="multiline:true,valiType:{length:[1,10000]}"
                           style="width:260px;height:80px"></textarea></td>
            </tr>
            <tr>
                <td>行程安排:</td>
                <td><textarea type="text" name="xcAp" class="easyui-textbox"
                              data-options="multiline:true,valiType:{length:[1,10000]}"
                              style="width:260px;height:80px"></textarea></td>
            </tr>
            <tr>
                <td>费用说明:</td>
                <td><textarea type="text" name="fySm" class="easyui-textbox"
                              data-options="multiline:true,valiType:{length:[1,10000]}"
                              style="width:260px;height:80px"></textarea></td>
            </tr>
            <tr>
                <td>预定须知:</td>
                <td><textarea type="text" name="ydXz" class="easyui-textbox"
                              data-options="multiline:true,valiType:{length:[1,10000]}"
                              style="width:260px;height:80px"></textarea></td>
            </tr>
            <tr>
                <td>注意事项:</td>
                <td><textarea type="text" name="zySx" class="easyui-textbox"
                              data-options="multiline:true,valiType:{length:[1,10000]}"
                              style="width:260px;height:80px"></textarea></td>
            </tr>
            <tr>
                <td>退改规则:</td>
                <td><textarea type="text" name="tgGz" class="easyui-textbox"
                              data-options="multiline:true,valiType:{length:[1,10000]}"
                              style="width:260px;height:80px"></textarea></td>
            </tr>
            <tr>
                <td>NZD原价:</td>
                <td><input type="text" name="oldNzdPrice" class="easyui-numberbox" id="nzdOldPrice"
                           data-options="required:true,precision:2,groupSeparator:',',decimalSeparator:'.',prefix:'$',suffix:'元/张'"
                           style="width:260px"></td>
            </tr>
            <tr>
                <td>NZD现价:</td>
                <td><input type="text" name="nzdPrice" class="easyui-numberbox" id="nzdPrice"
                           data-options="required:true,precision:2,groupSeparator:',',decimalSeparator:'.',prefix:'$',suffix:'元/张'"
                           style="width:260px"></td>
            </tr>
            <tr>
                <td>原价:</td>
                <td><input type="text" name="oldPrice" id="detail-oldPrice" class="easyui-numberbox"
                           data-options="required:true,precision:2,groupSeparator:',',decimalSeparator:'.',prefix:'￥',suffix:'元/张'"
                           style="width:260px"></td>
            </tr>
            <tr>
                <td>单价:</td>
                <td><input type="text" name="price" id="detail-price" class="easyui-numberbox"
                           data-options="required:true,precision:2,groupSeparator:',',decimalSeparator:'.',prefix:'￥',suffix:'元/张'"
                           style="width:260px"></td>
            </tr>
            <tr>
                <td>数量:</td>
                <td><input type="text" name="total" class="easyui-numberbox"
                           data-options="required:true,precision:0,groupSeparator:',',decimalSeparator:'.',suffix:'张'"
                           style="width:260px"/></td>
            </tr>
            <tr>
                <td colspan="2">logo图:<input id="logoImage" type="file" size="30" name="fileselect" multiple/>
                </td>
            </tr>
            <tr>
                <td colspan="2">轮播图:<input id="fileImage" type="file" size="30" name="fileselect" multiple/>
                </td>
            </tr>
        </table>
        <button id="photoSubmit" type="button" style="display: none"></button>
    </form>
    <div style="width:100%;height:auto;" id="preview">
    </div>
</div>
<%!
    private String htmlspecialchars(String str) {
        str = str.replaceAll("&", "&amp;");
        str = str.replaceAll("<", "&lt;");
        str = str.replaceAll(">", "&gt;");
        str = str.replaceAll("\"", "&quot;");
        return str;
    }
%>
<script type="text/javascript">
    var params = {
        fileInput: $("#fileImage").get(0),
        upButton: $("#photoSubmit").get(0),
        url:$("#ff").attr("action"),
        filter: function (files) {
            var arrFiles = [];
            for (var i = 0, file; file = files[i]; i++) {
                if (file.type.indexOf("image") == 0) {
                    if (file.size >= 512000) {
                        alert('您这张"' + file.name + '"图片大小过大，应小于500k');
                    } else {
                        arrFiles.push(file);
                    }
                } else {
                    alert('文件"' + file.name + '"不是图片。');
                }
            }
            return arrFiles;
        },
        onSelect: function (files) {
            var html = '', i = 0;
            $("#preview").html('<div class="upload_loading"></div>');
            var funAppendImage = function () {
                file = files[i];
                if (file) {
                    var reader = new FileReader()
                    reader.onload = function (e) {
                        html = html + '<div id="uploadList_' + i + '" style="float:left"><p>' +
                                '<a href="javascript:" class="upload_delete" title="删除" data-index="' + i + '">删除</a><br />' +
                                '<img id="uploadImage_' + i + '" src="' + e.target.result + '" class="upload_image" width="80px" height="80px"/></p>' +
                                '<span id="uploadProgress_' + i + '" class="upload_progress"></span>' +
                                '</div>';

                        i++;
                        funAppendImage();
                    }
                    reader.readAsDataURL(file);
                } else {
                    $("#preview").html(html);
                    if (html) {
                        //删除方法
                        $(".upload_delete").click(function () {
                            ZXXFILE.funDeleteFile(files[parseInt($(this).attr("data-index"))]);
                            return false;
                        });
                        //提交按钮显示
                        $("#fileSubmit").show();
                    } else {
                        //提交按钮隐藏
                        $("#fileSubmit").hide();
                    }
                }
            };
            funAppendImage();
        },
        onDelete: function (file) {
            $("#uploadList_" + file.index).fadeOut();
        },
        onDragOver: function () {
            $(this).addClass("upload_drag_hover");
        },
        onDragLeave: function () {
            $(this).removeClass("upload_drag_hover");
        },
        onProgress: function (file, loaded, total) {
            var eleProgress = $("#uploadProgress_" + file.index), percent = (loaded / total * 100).toFixed(2) + '%';
            eleProgress.show().html(percent);
        },
        onSuccess: function (file, response) {
            $("#datagrid").datagrid("reload");
            $dialog.dialog("close");
            $("#uploadInf").append("<p>上传成功，图片地址是：" + response + "</p>");
        },
        onFailure: function (file) {
            $("#uploadInf").append("<p>图片" + file.name + "上传失败！</p>");
            $("#uploadImage_" + file.index).css("opacity", 0.2);
        },
        onComplete: function () {
            //提交按钮隐藏
            $("#fileSubmit").hide();
            //file控件value置空
            $("#fileImage").val("");
            $("#uploadInf").append("<p>当前图片全部上传完毕，可继续添加上传。</p>");
        }
    };
    ZXXFILE = $.extend(ZXXFILE, params);
    ZXXFILE.init();

    var params1 = {
        fileInput: $("#logoImage").get(0),
        upButton: $("#photoSubmit").get(0),
        url:$("#ff").attr("action"),
        filter: function (files) {
            var arrFiles = [];
            for (var i = 0, file; file = files[i]; i++) {
                if (file.type.indexOf("image") == 0) {
                    if (file.size >= 512000) {
                        alert('您这张"' + file.name + '"图片大小过大，应小于500k');
                    } else {
                        arrFiles.push(file);
                    }
                } else {
                    alert('文件"' + file.name + '"不是图片。');
                }
            }
            return arrFiles;
        },
        onSelect: function (files) {
            var html = '', i = 0;
            $("#preview").html('<div class="upload_loading"></div>');
            var funAppendImage = function () {
                file = files[i];
                console.info(file);
                if (file) {
                    var reader = new FileReader()
                    reader.onload = function (e) {
                        html = html + '<div id="uploadList_' + i + '" style="float:left"><p>' +
                                '<a href="javascript:" class="upload_delete" title="删除" data-index="' + i + '">删除</a><br />' +
                                '<img id="uploadImage_' + i + '" src="' + e.target.result + '" class="upload_image" width="80px" height="80px"/></p>' +
                                '<span id="uploadProgress_' + i + '" class="upload_progress"></span>' +
                                '</div>';
                        i++;
                        funAppendImage();
                    }
                    reader.readAsDataURL(file);
                } else {
                    $("#preview").html(html);
                    if (html) {
                        //删除方法
                        $(".upload_delete").click(function () {
                            ZXXFILE.funDeleteFile(files[parseInt($(this).attr("data-index"))]);
                            return false;
                        });
                        //提交按钮显示
                        $("#fileSubmit").show();
                    } else {
                        //提交按钮隐藏
                        $("#fileSubmit").hide();
                    }
                }
            };
            funAppendImage();
        },
        onDelete: function (file) {
            $("#uploadList_" + file.index).fadeOut();
        },
        onDragOver: function () {
            $(this).addClass("upload_drag_hover");
        },
        onDragLeave: function () {
            $(this).removeClass("upload_drag_hover");
        },
        onProgress: function (file, loaded, total) {
            var eleProgress = $("#uploadProgress_" + file.index), percent = (loaded / total * 100).toFixed(2) + '%';
            eleProgress.show().html(percent);
        },
        onSuccess: function (file, response) {
            $("#datagrid").datagrid("reload");
            $dialog.dialog("close");
            $("#uploadInf").append("<p>上传成功，图片地址是：" + response + "</p>");
        },
        onFailure: function (file) {
            $("#uploadInf").append("<p>图片" + file.name + "上传失败！</p>");
            $("#uploadImage_" + file.index).css("opacity", 0.2);
        },
        onComplete: function () {
            //提交按钮隐藏
            $("#fileSubmit").hide();
            //file控件value置空
            $("#fileImage").val("");
            $("#uploadInf").append("<p>当前图片全部上传完毕，可继续添加上传。</p>");
        }
    };
    ZXXFILE = $.extend(ZXXFILE, params1);
    ZXXFILE.init();
    $(function () {
        /*
        *此处暂时忽略
        function queryCity() {

            $("#form-city").combobox({
                required: true,
                url: '${ctx}/mulanweb/common/city/search',
                valueField: 'Id',
                textField: 'NameCn',
                editable: false,
                queryParams: {
                    PageSize: 100,
                    PageNumber: 1
                },
                loadFilter: function (data) {
                    var result = [];
                    var currentSize = data.PageSize;
                    var totalSize = data.TotalRow;
                    if (data.ReturnCode == 1 && currentSize >= totalSize) {
                        if (data.DataList.length > 0) {
                            for (var tt = 0; tt < data.DataList.length; tt++) {
                                result.push({Id: data.DataList[tt].Id, NameCn: data.DataList[tt].NameCn});
                            }
                        }
                    } else {
                        Constant.showMessage("地点信息已超过最大值");
                    }
                    return result;
                }
            });
        }*/
        queryScenic();
        function queryScenic(){
            $("#form-city").combobox({
                url: '${ctx}/mulanweb/admin/scenic_spot/search',
                valueField: 'Id',
                textField: 'NameCn',
                editable: true,
                queryParams: {
                    PageSize: 100,
                    PageNumber: 1
                },
                loadFilter: function (data) {
                    var result = [];
                    var currentSize = data.PageSize;
                    var totalSize = data.TotalRow;
                    if (data.ReturnCode == 1 && currentSize >= totalSize) {
                        if (data.DataList.length > 0) {
                            for (var tt = 0; tt < data.DataList.length; tt++) {
                                result.push({Id: data.DataList[tt].Id, NameCn: data.DataList[tt].ScenicName});
                            }
                        }
                    } else {
                        Constant.showMessage("地点信息已超过最大值");
                    }
                    return result;
                },
                onChange: function (newV, oldV) {
                    $("#scenicSpotId").val(newV);
                    $("#cityId").val(newV);
                }
            });
        }
        /*
            * 此处暂时忽略
        $("#add-type").combobox({
            onChange: function (newV, oldV) {
                $("#typeId").val(newV);
                if (newV == 1) {
                    $("#city-name").html("景点");
                    queryScenic();
                } else {
                    $("#city-name").html("地点");
                    queryCity();
                }
            }
        });*/

        $("#nzdOldPrice").numberbox({
            onChange:function(newV,oldV){
                var tt  = Math.ceil(newV*Constant.exchangeRate) ;
                console.info(tt);
                $("#detail-oldPrice").numberbox("setValue",tt);
            }
        })
        $("#nzdPrice").numberbox({
            onChange:function(newV,oldV){
                var tt  =  Math.ceil(newV*Constant.exchangeRate) ;
                $("#detail-price").numberbox("setValue",tt);
            }
        })
    })
</script>
